vue项目打包清除console.log的4种方法

您所在的位置:网站首页 vue-cli 打包分离js vue项目打包清除console.log的4种方法

vue项目打包清除console.log的4种方法

2023-04-05 02:54| 来源: 网络整理| 查看: 265

第1种: uglifyjs-webpack-plugin插件,配置在vue.config.js中,不支持es6,已归档,不再维护,不推荐,vue-cli3,4可行,vue-cli5中未生效。(我项目中未生效,不附代码,可自行搜索尝试)

第2种: terser-webpack-plugin插件,配置在vue.config.js中,vue-cli5自带,vue-cli3,4需要下载插件,vue-cli3,4可行,vue-cli5中已无默认对应配置属性’drop_console’,自己添加后依旧未生效。(我项目中未生效,不附代码,可自行搜索尝试)

第3种: babel-plugin-transform-remove-console插件,配置在babel.config.js中,vue-cli5实测可行,vue-cli3,4也可行。(尝试后,谷歌浏览器控制台仅websocket的打印输出未清除,其他打印输出都是清除干净了的)

下载依赖

npm install babel-plugin-transform-remove-console -D or yarn add babel-plugin-transform-remove-console -D

babel.config.js中

const proPlugins = []; // 判断环境 if (process.env.NODE_ENV === 'production') { proPlugins.push('transform-remove-console'); } module.exports = { plugins: [...proPlugins], };

第4种: 不用插件,main.js中判断生产环境后window.console.log = function (){};即可,vue-cli5实测可行,vue-cli3,4也可行。(尝试出来的效果是清除得最干净的,但不清楚这种侵入式覆盖的写法有啥弊端没有)

main.js中

// 正式环境清除所有console.log if (process.env.NODE_ENV === 'production') { if (window) { window.console.log = function () {}; } }


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3